<template></template>
  
<script>
import {
    Icon,
    Button,
    CellGroup,
    Cell,
    Field,
    Col,
    Row,
    Image as VanImage,
    Divider,
    Checkbox,
    Pagination,
    Search,
    Sticky,
    Toast,
    Dialog,
} from 'vant'
Vue.use(Cell)
Vue.use(CellGroup)

Vue.use(Button, Dialog)
Vue.use(Col)
Vue.use(Row)
Vue.use(Icon)
Vue.use(VanImage)
Vue.use(Divider)
Vue.use(Checkbox)
Vue.use(Pagination)
Vue.use(Search)
Vue.use(Sticky)
import { _httpClient } from '@/libs/api'
import Header from '@/components/header.vue'
//import YSF from '@neysf/qiyu-web-sdk';
import { storage, setBaseApiFrefix, getBaseApiFrefix } from '@/libs/utils'
export default {
    components: { Button, Header, Icon, CellGroup, Cell, Field, Col, Row, Search, Sticky },

    data() {
        return {
            btnShow: true,
            pageParam: { name: '' },
            chosenContactId: '1',
            screenWidth: 0,
            searchValue: '',
            active: 2,
            currentPage: 1,
            fileUrl: '',
            items: [
                // { id: 1, userName: '用户1', time: '2020-12-02 22:08:00', user: '测试账户1', checked: true },
                // { id: 2, userName: '用户2', time: '2020-12-03 22:08:00', user: '测试账户2', checked: false },
                // { id: 3, userName: '用户3', time: '2020-12-03 22:08:00', user: '测试账户3', checked: true },
                // { id: 4, userName: '用户4', time: '2020-12-03 22:08:00', user: '测试账户4', checked: true },
                // { id: 5, userName: '用户5', time: '2020-12-03 22:08:00', user: '测试账户5', checked: false },
                // { id: 6, userName: '用户1', time: '2020-12-02 22:08:00', user: '测试账户1', checked: true },
                // { id: 7, userName: '用户2', time: '2020-12-03 22:08:00', user: '测试账户2', checked: false },
                // { id: 8, userName: '用户3', time: '2020-12-03 22:08:00', user: '测试账户3', checked: true },
                // { id: 9, userName: '用户4', time: '2020-12-03 22:08:00', user: '测试账户4', checked: true },
                // { id: 10, userName: '用户5', time: '2020-12-03 22:08:00', user: '测试账户5', checked: false },
                // { id: 11, userName: '用户1', time: '2020-12-02 22:08:00', user: '测试账户1', checked: true },
                // { id: 12, userName: '用户2', time: '2020-12-03 22:08:00', user: '测试账户2', checked: false },
                // { id: 13, userName: '用户3', time: '2020-12-03 22:08:00', user: '测试账户3', checked: true },
                // { id: 14, userName: '用户4', time: '2020-12-03 22:08:00', user: '测试账户4', checked: true },
                // { id: 15, userName: '用户5', time: '2020-12-03 22:08:00', user: '测试账户5', checked: false },
                // { id: 16, userName: '用户4', time: '2020-12-03 22:08:00', user: '测试账户4', checked: true },
                // { id: 17, userName: '用户5', time: '2020-12-03 22:08:00', user: '测试账户5', checked: false },
                // { id: 18, userName: '用户1', time: '2020-12-02 22:08:00', user: '测试账户1', checked: true },
                // { id: 19, userName: '用户2', time: '2020-12-03 22:08:00', user: '测试账户2', checked: false },
                // { id: 21, userName: '用户4', time: '2020-12-03 22:08:00', user: '测试账户4', checked: true },
                // { id: 22, userName: '用户22', time: '2020-12-03 22:08:00', user: '测试账户5', checked: false },
            ],
        }
    },
    created: function () {
        let oldHight = api.winWidth
        this.screenWidth = oldHight
        this.init()
    },
    mounted: function () {
        const oldHight = api.winHeight
        addEventListener('resize', () => {
            let newHight = api.winHeight
            this.btnShow = newHight < oldHight ? false : true
        })
    },
    methods: {
        init() {
            // YSF.init('98193d444c97cac955924a5ac9fff29c').then(ysf => {
            //     ysf('open');
            // }).catch(error => {
            //     console.log('sdk加载失败---', error);
            // });
        },
        //搜索
        async onSearch() {
            let _this = this
            Toast.loading({
                mask: true,
                forbidClick: true,
                duration: 0,
                message: 'Loading...',
            })
            try {
                let res = await _httpClient.post(_httpClient.getApiPrefix() + '/app/user/userInfo/repairUserlist', {
                    body: { userAccound: _this.searchValue },
                })

                if (res.code === 200) {
                    Toast.clear()
                    _this.items = res.rows
                } else {
                    //alert(res.msg)
                    Toast.fail(res.msg)
                }
            } catch (e) {
                Toast.fail(JSON.stringify(e))
            }
        },

        //点击选中事件
        select(i) {
            if (this.items[i].checked) {
                this.items[i].checked = false
            } else {
                this.items[i].checked = true
            }
        },

        //确认
        confirm() {
            //获取选中数据
            let selected = []
            for (let i = 0; i < this.items.length; i++) {
                if (this.items[i].checked) {
                    selected.push(this.items[i])
                }
            }
            //判断是否选择数据
            if (selected.length == 0) {
                Dialog.confirm({
                    title: '提示',
                    message: '当前未选择用户数据，是否直接返回?',
                    theme: 'round-button',
                })
                    .then(() => {
                        //点击确定，继续执行后续操作
                        storage.set('items', this.items)
                        api.sendEvent({
                            name: 'resultUser',
                            extra: {
                                selectUser: selected,
                            },
                        })
                        api.closeWin()
                    })
                    .catch(() => { })
            } else {
                storage.set('items', this.items)
                api.sendEvent({
                    name: 'resultUser',
                    extra: {
                        selectUser: selected,
                    },
                })
                api.closeWin()
            }
        },
    },
}
</script>
  
<style>
body {
    background-color: White;
}

.clickbtn {
    width: 1;
    margin: 5px 10px;
    line-height: 45px;
    border: 1px #ccc dashed;
    text-align: center;
}

.buttonRight {
    position: fixed;
    bottom: 0px;
    width: 100%;
    height: 50px;
    background-color: #1c6c8d;
    border-color: #1c6c8d;
}

.message {
    font-size: 20px;
    margin-top: 0px;
    margin-left: -10px;
    font-weight: bold;
}

.divStyle {
    margin-left: 3px;
    margin-right: 3px;
}

.pagination {
    position: fixed;
    bottom: 15px;
    width: 300px;
    margin-left: 10%;
    color: rgb(0, 0, 255);
    text-align: center;
}

.textScroll {
    display: inline-block;
    position: fixed;
    top: 9rem;
    bottom: -20px;
    overflow: scroll;
    right: 0;
    width: 100%;
    margin-bottom: 4.7rem;
    z-index: 1;
}
</style>
  